import Taro, { Component } from '@tarojs/taro';
import { View, Button, Text } from '@tarojs/components';
import classNames from 'classnames';
import { observer, inject } from '@tarojs/mobx';
import './index.styl';
import Article from '../../data-center/article';
import WxParse from '../../components/wxParse/wxParse';

class Detail extends Component {
  constructor() {
    this.state = {
    //   content: '' // html marketdown字符串
    };
  }

//   componentDidMount() {
//     const article = '<div style="color: red">我是HTML代码</div>';
//     WxParse.wxParse('article', 'html', article, this.$scope, 5);
//   }

  componentWillMount() {
    const { id } = this.$router.params;

    this.getArticleDetail(id);
  }

  async getArticleDetail(id) {
    const res = await Article.getArticle(id);

    const { content } = res.data;

    WxParse.wxParse('article', 'html', content, this.$scope, 5);
  }

  componentWillReact() {}

  componentWillUnmount() {}

  componentDidShow() {}

  componentDidHide() {}

  render() {
    return (
      <View className="detail">
        <View className="content">
          <import src="../../components/wxParse/wxParse.wxml" />
          <template is="wxParse" data="{{wxParseData:article.nodes}}" />
        </View>
      </View>
    );
  }
}

export default Detail;